Dashboard Temp Share Shortlinks Frames API

HTMLify

index.html
Views: 28 | Author: huxn-webdev 
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>theArt</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <!-- Navbar -->
    <nav>
      <ul>
        <li><a href="">HuXn</a></li>
      </ul>

      <div class="burger">
        <span></span>
        <span></span>
        <span></span>
      </div>
    </nav>
    <!-- End Navbar -->

    <header>
      <h1 class="main-headings">
        WHAT <br />
        IS CALLED ART?
      </h1>
      <p class="primary-headings">
        Art, also called (to distinguish it from other art forms) visual art, a
        <span class="bg-gray"> visual object or experience </span> consciously
        created through an expression of skill or imagination.
      </p>
    </header>

    <main>
      <img
        src="https://images.unsplash.com/photo-1579783902614-a3fb3927b6a5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=745&q=80"
        class="img"
      />
      <img
        src="https://images.unsplash.com/flagged/photo-1572392640988-ba48d1a74457?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=764&q=80"
        class="img"
      />
      <img
        src="https://images.unsplash.com/photo-1588571590924-433cc2020a12?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80"
        class="img"
      />
      <img
        src="https://images.unsplash.com/photo-1495462911434-be47104d70fa?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=435&q=80"
        class="img"
      />
      <img
        src="https://images.unsplash.com/photo-1579783901586-d88db74b4fe4?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=748&q=80"
        class="img"
      />
      <img
        src="https://images.unsplash.com/photo-1579783901837-c78c2310be05?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=804&q=80"
        class="img"
      />
    </main>

    <section class="section-three">
      <h1 class="main-headings">7 TYPES OF ART</h1>
      <p class="primary-headings">
        The seven different art forms are
        <span class="bg-gray">
          Painting, Sculpture, Literature, Architecture, Theater, Film, and
          Music
        </span>
        . However, back in the day, the seven different art forms were called
        the Liberal Arts, consisting of Grammar, Logic, Rhetoric, Arithmetic,
        Geometry, Astronomy, and Music.
      </p>

      <div class="list">
        <div class="item">
          <h1>PAINTING</h1>
          <img
            src="https://images.unsplash.com/photo-1579965342575-16428a7c8881?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=762&q=80"
          />
        </div>
        <div class="item">
          <h1>SCULPTURE</h1>
          <img
            src="https://images.unsplash.com/photo-1637666505754-7416ebd70cbf?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=435&q=80"
          />
        </div>
        <div class="item">
          <h1>LITERATURE</h1>
          <img
            src="https://images.unsplash.com/photo-1532012197267-da84d127e765?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80"
          />
        </div>
        <div class="item">
          <h1>ARCHITECTURE</h1>
          <img
            src="https://images.unsplash.com/photo-1479839672679-a46483c0e7c8?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2020&q=80"
          />
        </div>
        <div class="item">
          <h1>CINEMA</h1>
          <img
            src="https://images.unsplash.com/photo-1604975701397-6365ccbd028a?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=435&q=80"
          />
        </div>
        <div class="item">
          <h1>MUSIC</h1>
          <img
            src="https://images.unsplash.com/photo-1598547535077-26d10ae80496?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=781&q=80"
          />
        </div>
        <div class="item">
          <h1>THEATER</h1>
          <img
            src="https://images.unsplash.com/photo-1578920568769-3c1b145bc9ea?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80"
          />
        </div>
      </div>
    </section>

    <footer>
      <div class="logo-container">
        <h1>Logo</h1>
        <p>
          Lorem Ipsum is simply dummy text of the printing and typesetting
          industry. Lorem Ipsum has been the industry's standard dummy text ever
          since the 1500s.
        </p>
      </div>

      <div class="about-company">
        <div class="container">
          <h1>About</h1>
          <p>News & Blog</p>
          <p>Features</p>
          <p>About Us</p>
        </div>
        <div class="container">
          <h1>Company</h1>
          <p>How We Work?</p>
          <p>Capital</p>
          <p>Security</p>
        </div>
        <div class="container">
          <h1>Support</h1>
          <p>FAQs</p>
          <p>Support</p>
          <p>Contact Us</p>
        </div>
      </div>
    </footer>
  </body>
</html>

Share this file: